<template>
  <div>
    <el-row :gutter="20">
      <el-col :span="4" style="margin-bottom: 10px">
        <el-select
          v-model="listQueryIn.semesterCode"
          filterable
          clearable
          placeholder="请选择入学学期"
          style="width: 100%"
        >
          <el-option
            v-for="v in semesterData"
            :key="v.id"
            :label="v.name"
            :value="v.code"
          ></el-option>
        </el-select>
      </el-col>
      <el-col :span="4" style="margin-bottom: 10px">
        <!-- <el-input
          placeholder="请输入校区"
          v-model="listQueryIn.schoolName"
          clearable
        >
        </el-input> -->
        <SchoolSelect type="2" @emit="setScool" />
      </el-col>
      <el-col :span="4" style="margin-bottom: 10px">
        <MajorTreeSelect @emit="handleMajor" />
        <!-- <el-input
          placeholder="请输入专业"
          v-model="listQueryIn.majorsName"
          clearable
        >
        </el-input> -->
      </el-col>
      <el-col :span="4" style="margin-bottom: 10px">
        <el-input
          placeholder="请输入上课起始月"
          v-model="listQueryIn.name"
          clearable
        >
        </el-input>
      </el-col>
      <el-col :span="4" style="margin-bottom: 10px">
        <el-date-picker
          v-model="listQueryIn.courseStartDate"
          type="date"
          placeholder="选择授课日期"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          style="width: 100%"
        >
        </el-date-picker>
      </el-col>
      <el-col :span="4" style="margin-bottom: 10px">
        <el-input
          placeholder="请输入主讲教师"
          v-model="listQueryIn.teacherName"
          clearable
        >
        </el-input>
      </el-col>
      <el-col :span="4" style="margin-bottom: 10px">
        <TeachingSiteSelect @emitObj="handleClassAddr" />
      </el-col>
      <el-col :span="4" style="margin-bottom: 10px">
        <el-select
          v-model="listQueryIn.isGraduate"
          placeholder="请选择是否结课"
          clearable
          style="width: 100%"
        >
          <el-option label="已结课" value="1"> </el-option>
          <el-option label="未结课" value="2"> </el-option>
        </el-select>
      </el-col>
      <!-- <el-col :span="4" style="margin-bottom: 10px">
        <el-input
          placeholder="请输入班级人数"
          v-model="listQueryIn.studentNum"
          clearable
        >
        </el-input>
      </el-col> -->
      <el-col :span="8" style="margin-bottom: 10px">
        <el-button type="custom" @click="refreshList()" plain>搜索</el-button>
        <el-button type="custom" @click="handleAdd()">新增</el-button>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import Bus from '@/utils/bus.js'
export default {
  components: {
    MajorTreeSelect: () =>
      import('@/components/dataSelect/majorSelect/MajorTreeSelect'),
    SchoolSelect: () => import('@/components/dataSelect/schoolSelect'),
    TeachingSiteSelect: () =>
      import('@/components/dataSelect/teachingSiteSelect'),
  },
  data() {
    return {
      listQueryIn: {
        name: '',
        className: '', //班级名称
        classAddr: '', //固定教室
        directionName: '', //方向名称
        gradeName: '', //年级名称
        isGraduate: '', //是否已毕业：1是，2否
        majorsName: '', //专业名称
        schoolName: '', //校区名称
        semesterName: '', //学期名称
        studentNum: '', //人数
        teacherName: '', //教员姓名
        trainingName: '', //培训类型名称
        page: 1,
      },
    }
  },
  props: ['classData', 'gradeData', 'semesterData'],
  methods: {
    refreshList() {
      Bus.$emit('refreshClasGradeList', this.listQueryIn)
    },
    handleAdd() {
      Bus.$emit('showDialogClasGradeAdd')
    },
    setScool(obj) {
      let { code } = obj
      this.listQueryIn.schoolCode = code
    },
    handleClassAddr(obj) {
      if (obj) {
        let { id } = obj
        this.listQueryIn.classroomCode = id
      } else {
        this.listQueryIn.classroomCode = ''
      }
    },
    handleMajor(arr) {
      if (arr.length != 2) return
      this.listQueryIn.majorsCode = arr[0]
      this.listQueryIn.directionCode = arr[1]
    },
  },
}
</script>